<template>
    <div>
        <h3>房型添加</h3>

        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">房型名称</td>
                    <td>
                        <input type="text" v-model="querinfo.HouseTypeName">
                    </td>
                </tr>

                <tr>
                    <td align="right">房型图片</td>
                    <td>
                        <input type="file" @change="upimg">
                        <img :src="querinfo.Photo" width="150" height="100">
                    </td>
                </tr>

                <tr>
                    <td align="right">房型面积</td>
                    <td>
                        <input type="text" v-model="querinfo.Area">
                    </td>
                </tr>

                <tr>
                    <td align="right">是否有窗</td>
                    <td>
                        <input type="radio" name="IsWindow" :value="1" v-model="querinfo.IsWindow">是
                        <input type="radio" name="IsWindow" :value="0" v-model="querinfo.IsWindow">否
                    </td>
                </tr>

                <tr>
                    <td align="right">入住人数</td>
                    <td>
                        <input type="text" v-model="querinfo.Count">
                    </td>
                </tr>

                <tr>
                    <td align="right">房型价格</td>
                    <td>
                        <input type="text" v-model="querinfo.Price">
                    </td>
                </tr>

                <tr>
                    <td align="right">房型状态</td>
                    <td>
                        <input type="radio" name="State" :value="1" v-model="querinfo.State">发布
                        <input type="radio" name="State" :value="0" v-model="querinfo.State">不发布
                    </td>
                </tr>

                <tr>
                    <td align="right">创建时间</td>
                    <td>
                        <input type="date" v-model="querinfo.CreateTime">
                    </td>
                </tr>

                <tr>
                    <td align="right"></td>
                    <td>
                        <input type="button" value="添加" class="btn btn-primary" @click="ok">
                    </td>
                </tr>

            </tbody>
        </table>


    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted, useSlots } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import moment from 'moment';
import axios from 'axios';
const route = useRoute();
const router = useRouter();

let querinfo=reactive({
  "HouseTypeName": "",
  "Photo": "",
  "Area": "",
  "IsWindow": "",
  "Count": "",
  "Price": "",
  "State": "",
  "CreateTime": "",
})

//2-20个汉字 /^[\u4e00-\u9fa5]{2,20}$/
//手机号：/^1[3-9]\d{9}$/
//正整数：/^[1-9]\d*$/
//正小数：/^[1-9]\d*(\.\d*)?$/
const ok=()=>{
    if(querinfo.HouseTypeName==""){
        alert('房型名称不能为空');
        return;
    }
    let reg=/^[\u4e00-\u9fa5]{2,20}$/
    if(!reg.test(querinfo.HouseTypeName)){
        alert('房型名称由2-20个汉字组成');
        return;
    }
    if(querinfo.Area==""){
        alert('房型面积不能为空');
        return;
    }
    let reg1=/^[1-9]\d*(\.\d*)?$/
    if(!reg1.test(querinfo.Area)){
        alert('房型面积只能是正小数');
        return;
    }
    if(querinfo.Count==""){
        alert('入住人数不能为空');
        return;
    }
    let reg2=/^[1-9]\d*$/
    if(!reg2.test(querinfo.Count)){
        alert('入住人数只能是正整数');
        return;
    }
    if(querinfo.Price==""){
        alert('房型价格不能为空');
        return;
    }
    if(!reg1.test(querinfo.Price)){
        alert('房型价格只能是正小数');
        return;
    }
    


    axios({
        method:"post",
        url:"/api/House/HouseAdd",
        data:querinfo
    })
    .then(res=>{
        if(res.data==-1){
            alert('房型名称重复');
        }
        else if(res.data>0){
            alert('添加成功')
            router.push('/houseshow')
        }
        else{
            alert('添加失败');
        }
    })
}

const upimg=(e:any)=>{
    let m=e.target.files[0];
    let d=new FormData();
    d.append('file',m)
    axios({
        method:"post",
        url:"/api/House/Upfile",
        data:d
    })
    .then(res=>{
        if(res.data=="图片格式错误"){
            alert('图片格式错误')
        }
        else if(res.data=="大于2MB"){
            alert('大于2MB')
        }
        else{
            alert('上传成功')
            querinfo.Photo=res.data
        }
    })
}
</script>









<style scoped>

</style>